<template>
		<scroll-view scroll-y="true" style="height: 100%;">
			<view style="height: 50rpx;"></view>
				<view v-for="(item,index) in  list" :key="index">
					<view class="item_account a flex align" v-if="item.account==userInfo.email" >
						<view class="" >
							<image :src="$fun.imgUrl(item.avatar)" mode=""></image>
						</view>
						<view class="info">
							<view>{{item.account}}</view>
							<view >{{$t('user.name55')}}</view>
						</view>
					</view>
					<view class="item_account flex-between" v-else @click="changeAccount(item)">
						<view class="flex align">
								<view  style="">
									<image :src="$fun.imgUrl(item.avatar)" mode=""></image>
								</view>
							<view class="info">
								<view>{{item.account}}</view>
								<view ></view>
							</view>
						</view>
						<view class="" @click.stop="handleDel(item)">
							<u-button type="primary" :text="$t('user.name56')" color="#ff424c" ></u-button>
						</view>
					</view>
				</view>
				<view style="height: 100rpx;"></view>
				<button class="add-btn" style="background: #1E84F1;color: #FFFFFF;margin:5px 15px" @click="addUserCode('add')">{{$t('user.name57')}}</button>
		</scroll-view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				list:[],
				userInfo:{}
			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title:this.$t('user.name16')
			})
			this.getList()
		},
		methods: {
			...mapMutations(['login']),
			handleDel(val){
				uni.showModal({
					content: this.$t('user.name58'),
					success: (e) => {
						if (e.confirm) {
							const newObj = this.list.filter(item=> item.account != val.account)
							this.list = newObj
							console.log(this.list.filter(item=> item.account != val.account));
							uni.setStorageSync('userCode', JSON.stringify(newObj))
						}
					}
				});
				
			},
			getList(){
				this.$fun.ajax.post('user/index', {}).then(res => {
					if (res.code == 1) {
						this.userInfo = res.data
						if(uni.getStorageSync('userCode')){
							this.list = JSON.parse(uni.getStorageSync('userCode'));
						}
					}
				})

			},
			addUserCode(){
				this.$fun.jump('/pageA/public/login',0,0)
			},
			changeAccount(item){
				let data = {
					account:item.account,
					password:item.password,
				}
				this.$fun.ajax.post('user/login',{...data}).then(res=>{
					if(res.code==1){
						this.$fun.msg(this.$t('user.name59'))
						uni.setStorageSync('token', res.data.userinfo.token);
						uni.setStorageSync('userinfo', res.data.userinfo);
						this.$fun.jump('/pages/user/user',3,500)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
page{
	background: #F5F5F5;
	height: 100%;
}
.item_account{
	margin: 10rpx 30rpx;
	height: 152rpx;
	background: #FFFFFF;
	border: 2rpx solid #FFFFFF;
	border-radius: 10rpx;
	display: flex;
	padding: 0 20rpx;
	image{
		width: 98rpx;
		height: 98rpx;
		margin-right: 20rpx;
	}
	.info{
		display: flex;
		justify-content: center;
		flex-direction: column;
		view:nth-child(1){
			color: #333333;
			font-size: 30rpx;
			font-weight: bold;
		}
		view:nth-child(2){
			color: #4981F7;
			font-size: 24rpx;
		}
	}
}

.a{
	background: #EBF1FF;
	border: 2rpx solid #4981F9;
}
</style>
